<!DOCTYPE html>
<html lang="zh-CN">

<head>
  <meta charset="UTF-8" />
  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
  <title>数回科技</title>
  <!-- fullpage样式表 -->
  <link rel="stylesheet" href="./css/jquery.fullPage.css" />
  <!-- 清除默认样式和公用头尾样式 -->
  <link rel="stylesheet" href="./css/basic.css" />
  <!-- 首页 -->
  <link rel="stylesheet" href="./css/index.css" />
  <!-- less -->
  <link rel="stylesheet" href="./css/less.css" />
</head>

<body>
  <div id="header">
    <!-- 头部版心 -->
    <div class="header-wrap index-wrap">
      <!-- 左侧logo和导航区域 -->
      <div class="header-left">
        <!-- logo区域 -->
        <h1 id="logo">
          <a href="#">
            <img src="./img/logo.png" alt="logo" />
            <!-- <img src="./img/logo.png" alt="" /> active那个有用-->
          </a>
        </h1>

      </div>
      <!-- 右侧功能区域 -->
      <div class="header-right">
        <!--导航菜单 -->
        <ul id="navs">
          <li onclick="goToPage(1)"><a href="#"> 首页 </a></li>
          <li onclick="goToPage(2)"><a href="#"> 产品介绍 </a></li>
          <li onclick="goToPage(3)"><a href="#"> 服务链条 </a></li>
          <li onclick="goToPage(4)"><a href="#"> 联系我们 </a></li>
        </ul>
        <!-- 更多菜单区域 -->
        <div class="func-wrap" id="func-btn">
          <img src="./img/menu.png" alt="" class="func-img" />
          <img src="./img/func-close.png" alt="" class="func-close" />

          <div class="show-func" id="show-func">
            <!-- 添加蒙版 -->
            <div class="visbox"></div>

            <div class="right">
              <ul>
                <li onclick="goToPage(1)"><a href="#"> 首页 </a></li>
                <li onclick="goToPage(2)"><a href="#"> 产品介绍 </a></li>
                <li onclick="goToPage(3)"><a href="#"> 服务链条 </a></li>
                <li onclick="goToPage(4)"><a href="#"> 联系我们 </a></li>
                <!-- 有二级菜单 -->
                <!-- <li class="func-links">
                  <a href="#"> news </a>
                  <div class="erji-wrap">
                    <a href="#"> News updates </a>
                    <a href="#"> Company Profile </a>
                  </div>
                </li> -->
              </ul>

              <!-- 尾部脚注 -->
              <!-- <p>@ ALL RIGHT RESERVED 2023. Milestone</p> -->
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>

  <!-- 全屏区域 -->
  <div id="fullpage">
    <!-- 第一屏幕 -->
    <div class="section section1 fp-auto-height" style="background-image: url(./img/p1016.png)">
      <div class="section1-wrap index-wrap">
          <div class="left">
              <div class="top" style="background-image: url(./img/p4007.png)">
                  <p class="top-p1">数回数字人平台</p>
                  <p class="top-p2">Digital Circle </p>
                  <div class="heng"></div>
              </div>
              <div class="main">
                  <p class="main-p1">强化场景</p>
                  <p class="main-p2">
                      智能最新研发的话术生成系统基于大模型和专家系统，能够根据用户输入的数据直接生成准确、通顺的话术草稿，并使得大批量精细化场景的话术高效交付被实现。而之所以一知能处于行业领先地位实现话术自动化的上线，离不开过去服务过的每一位客户，知识库里包含经过沉淀后的几十万套话术和过去海量的文本记录，正是使之成为可能的基础和关键。
                  </p>
                  <div class="main-button">
                      <div class="button-1"><img src="./img/p4006.png" alt=""> 服务咨询</div>
                      <div class="button-2"><img src="./img/p4008.png" alt=""> 服务体验</div>
                  </div>
              </div>
          </div>
          <div class="right">
              <img src="./img/p1001.png" alt="" class="right-tu">
              <div class="right-div"></div>
          </div>
      </div>
  </div>

    <!-- 第二屏幕 -->
    <div class="section section2 fp-auto-height">
      <div class="section2-wrap">
        <div class="left" style="background-image: url(./img/p3000.png)">
          <div class="left-qu">
            <p>2D数字人</p>
            <img class="qu-img" src="./img/p1036.png">
          </div>
        </div>
        <div class="right" style="background-image: url(./img/p3001.png)">
          <div class="left-qu">
            <p>3D数字人</p>
            <img class="qu-img" src="./img/p1037.png">
          </div>
        </div>

        <div class="arrow-down" onclick="goToNextPage()">
          <p>NEXT PAGES</p>
          <img src="./img/p1012.png" alt="Down Arrow">
        </div>
      </div>
    </div>

    <!-- 第三屏幕 -->
    <div class="section section3 fp-auto-height" style="background-image: url(./img/p2003.png)">
      <div class="section3-wrap index-wrap">
        <div class="left">
          <div class="iphone">
            <img class="iphone-div" src="./img/p1004.png">
            <video class="embed-responsive-item phone2" allowfullscreen preload="load" autoplay muted loop>
              <source src="https://www.4seas-ip.com/zhi.mp4" type="video/mp4" />
            </video>
          </div>
        </div>
        <div class="right">
          <div class="right-top">
            <p class="top-p1">数字人直播展示</p>
            <p class="top-p2">Digital human live </p>
          </div>
          <div class="right-main" style="background-image: url(./img/p1003.png)">
            智能最新研发的话术生成系统基于大模型和专家系统，能够根据用户输入的数据直接生成准确、通顺的话术草稿，并使得大批量精细化场景的话术高效交付被实现。而之所以一知能处于行业领先地位实现话术自动化的上线，离不开过去服务过的每一位客户，知识库里包含经过沉淀后的几十万套话术和过去海量的文本记录，正是使之成为可能的基础和关键。
          </div>
          <div class="right-fen">
            <div class="right-fen-lei">
              <img src="./img/p1008.png" alt="">
              <p>虚拟主播</p>
            </div>
            <div class="right-fen-lei">
              <img src="./img/p1034.png" alt="">
              <p>AI视频</p>
            </div>
            <div class="right-fen-lei">
              <img src="./img/p1031.png" alt="">
              <p>AI音频</p>
            </div>
            <div class="right-fen-lei">
              <img src="./img/p1007.png" alt="">
              <p>一键生成</p>
            </div>
            <div class="right-fen-lei">
              <img src="./img/p1010.png" alt="">
              <p>创意灵感</p>
            </div>
            <div class="right-fen-lei fen-button">
              <img src="./img/p4006.png" alt=""> 服务咨询
            </div>
          </div>
        </div>
      </div>
      <div class="arrow-down" onclick="goToNextPage()">
        <p>NEXT PAGES</p>
        <img src="./img/p1012.png" alt="Down Arrow">
      </div>
    </div>

    <!-- 第四屏幕 -->
    <div class="section section4 fp-auto-height" style="background-image: url(./img/p4001.png)">
      <div class="section4-wrap index-wrap">
        <div class="left">
          <div class="top">
            <p class="top-p1">数回数字科技有限公司</p>
            <p class="top-p2">Shuhui Digital Technology Co., Ltd</p>
          </div>
          <div class="main">
            <div class="main-er">
              <img src="./img/p4002.png" alt="">
              <p>联系我们</p>
            </div>
            <div class="main-er">
              <img src="./img/p4002.png" alt="">
              <p>关注公众号</p>
            </div>
            <div class="main-div">
              <div class="main-div-1">
                <div class="main-div-num">
                  01
                </div>
                <div>
                  <p class="main-div-title">创意设计</p>
                  <p class="main-div-word">智能最新研发的话术生成系统基于大模型和专家系统，能够根据用户输入的数据直接生成准确、通顺的话术草稿</p>
                </div>
              </div>
              <div class="main-div-1">
                <div class="main-div-num">
                  02
                </div>
                <div>
                  <p class="main-div-title">精英团队</p>
                  <p class="main-div-word">智能最新研发的话术生成系统基于大模型和专家系统，能够根据用户输入的数据直接生成准确、通顺的话术草稿</p>
                </div>
              </div>
            </div>
          </div>
          <div class="footer">
            <div>
              <img src="./img/logo.png" />
            </div>
            <div class="lianxi">
              <p class="lianxi-1">
                <img class="img-1" src="./img/p4003.png" />
                联系电话：1515643521
              </p>
              <p class="lianxi-2">
                <img class="img-2" src="./img/p4004.png" />
                详细地址：某某市某某街道某某栋
              </p>
            </div>
          </div>
        </div>
        <div class="right">
          <img src="./img/p4005.png" />
        </div>
      </div>
    </div>

  </div>
</body>
<script src="./js/jquery.min.js"></script>
<!-- 引入全屏插件 -->
<script src="./js/jquery.fullPage.min.js"></script>
<!-- <script src="https://cdn.bootcdn.net/ajax/libs/fullPage.js/4.0.9/fullpage.min.js"></script> -->
<!-- 公用 -->
<script src="./js/common.js"></script>
<script src="./js/autofit.js"></script>
<script>


  $(function () {
    $('#fullpage').fullpage({
      // 字体跟着窗口缩放
      resize: true,
      navigation: true,
      navigationPosition: 'left',
      navigationTooltips: ['首页', '产品介绍', '服务链条', '联系我们'],

      afterLoad: function (anchorLink, index) {
        console.log('index', index);
        // if (index == 4) {
        //   $('#header').css('display', 'none');
        // } else {
        //   $('#header').css('display', 'block');
        // }
      },
    });
  });

  function goToNextPage() {
    $.fn.fullpage.moveSectionDown();
    // fullpage_api.moveSectionDown();
  }

  function goToPage(index) {
    event.preventDefault();
    console.log('dad', 321)
    $.fn.fullpage.silentMoveTo(index);
  }

  // 组织事件冒泡
  $('#show-func').click(function (e) { e.stopPropagation(); });
  // 鼠标跟随效果
  let hover = document.getElementById('mouse-hover');
  // 获取鼠标消失的元素
  let hoverHide = document.querySelectorAll('.mouse-hide');

  // 模拟点击行为
  let flag = true;
  $('#custom-radio').click(function () {
    if (flag) {
      $(this).addClass('current');
      $('#hidden-input').val(flag);
      flag = false;
    } else {
      $(this).removeClass('current');
      $('#hidden-input').val(flag);
      flag = true;
    }
  });
</script>

</html>